<template>
  <div>
    <h1>App</h1>
    <!-- http://localhost:8080/index.html#sdsds -->

    <ul>
      <li>
        <!-- http://localhost:8080/#/a -->
        <router-link to="/a"> /a -> Home</router-link>-
        <router-link to="/a/b/c/d"> /a -> Home-TopNav</router-link>
      </li>
      <li>
        <router-link to="/a/e/f/g"> /a -> Home-TopBar</router-link>
      </li>
      <li>
        <router-link to="/a/e/f/g/x/y"> /a -> Home-TopBar-shop</router-link>
      </li>
    </ul>

    <router-view></router-view>
  </div>
</template>

<script>
export default {
  data() {
    return {}
  },
}
</script>
<style>
div {
  border: solid;
  padding: 10px;
}
</style>